import QtQuick 2.15
import QtQuick.Controls 2.15

ComboBox {
    id: pbComboBox
    width: 120
    height: 36
    hoverEnabled: true
    focusPolicy: Qt.ClickFocus
    property alias color: textContent.color
    property alias fontSize: textContent.font.pixelSize

//    property alias titleText:     titleLabel.text
//    property alias titleRequired: titleLabel.required

    property real backgroundRadius: 2

    background: Rectangle {
        implicitWidth: pbComboBox.width
        implicitHeight: pbComboBox.height
        radius: pbComboBox.backgroundRadius
        border.width: 1
        border.color: "#DCDCDC"
        color: {
            if ( !pbComboBox.enabled ) { return "#f1f2f6"; }

            if ( pbComboBox.hovered ) { return "#f0f2f4"; }

            return "#ffffff";
        }

        Behavior on color { ColorAnimation { duration: 200 } }
    }

    contentItem: Text {
        id:textContent
        leftPadding: 15
        text: pbComboBox.displayText
        font.pixelSize: 12
        horizontalAlignment: Text.AlignLeft
        verticalAlignment: Text.AlignVCenter
        elide: Text.ElideRight
        color: {
            if ( !pbComboBox.enabled ) { return "#ACACAC"; }

            return "#505050";
        }

        Behavior on color { ColorAnimation { duration: 200 } }
    }

    indicator: Image {
        anchors.right: parent.right
        anchors.rightMargin: 10
        anchors.verticalCenter: parent.verticalCenter
        rotation: 180
        source: "qrc:/images/ComboBoxArrow.png"
    }

    delegate: ItemDelegate {
        width: pbComboBox.width
        contentItem: Rectangle
        {
            anchors.fill:parent
            color:hovered ? '#1A20C6B1': 'transparent'
            Text {
                leftPadding: 15
                anchors.verticalCenter: parent.verticalCenter
                text: {
                    if(textRole){
                        return modelData[textRole]
                    }
                    return modelData
                }

                color: "#505050"
                font: pbComboBox.font
                elide: Text.ElideRight
                verticalAlignment: Text.AlignVCenter
            }
        }

    }

    popup: Popup {
        y: pbComboBox.height +6
        width: pbComboBox.width
        implicitHeight: listview.contentHeight
        padding: 0
        topMargin: 30
        bottomMargin: 30

        contentItem: ListView {
            id: listview
            clip: true
            model: pbComboBox.popup.visible ? pbComboBox.delegateModel : null
            currentIndex: pbComboBox.highlightedIndex

            ScrollIndicator.vertical: ScrollIndicator { }
        }
        // 左边缘及上边缘阴影
        background: Rectangle{
            anchors.fill: parent
            color: 'white'
            radius: 0
            layer.enabled: true
            layer.effect: Item
            {
                BorderImage {
                    anchors.fill: parent
                    anchors.leftMargin: -16
                    anchors.rightMargin: -16
                    anchors.topMargin: -12
                    anchors.bottomMargin: -20
                    border.left: 16
                    border.right: 16
                    border.top: 12
                    border.bottom: 20
                    source: "qrc:/images/DialogFrame3.png"
                }
            }
        }
    }

//    PBTitleText {
//        id: titleLabel
//    }
}
